/*#start general*/
* {
	margin: 0;
	padding: 0;
}
ul {
	list-style: none;
}
body {nav-menu-collapse
	font-family: 'Segoe UI';
}
@font-face {
	font-family: Davida;
	src: url('../../font/davida.ttf');
}
/*#end general*/
/*#start top-link*/
aside.top-link {
	position: fixed;
	bottom: 5%;
	right: 2%;
	z-index: 99;
	display: none;
}
	aside.top-link > a {
		display: block;
		width: 35px;
		height: 35px;
		background: rgba(0, 0, 0, 0.2) url('../../image/icon/top.png') no-repeat center center;
		border-radius: 50%;
		transition: 0.2s;
		cursor: pointer;
	}	
		aside.top-link > a:hover {
			background-color: black;
		}
/*#end top-link*/
/*#start header*/
header {
	background-color: #484a50;
	margin-bottom: 0px !important;
}
	header:after {
		content: '';
		display: block;
		clear: both;
	}
	/*#start logo*/
	header > .logo {
		float: left;
		margin-left: 10px;
	}
		header > .logo > h1 {
			margin: 0px;
			font-size: 0px;
		}
			header > .logo > h1 > a {
				display: block;
				padding: 13px 0px 10px 0px;
			}
				header > .logo > h1 > a > img {
					height: 17px;
					width: 181px;
				}
			header > .logo > h1 > i {
				visibility: hidden;
				position: absolute;
				max-width: 0px;
				max-height: 0px;
			}
	/*#end logo*/
	/*#start nav-menu*/
	header > .nav-menu {
		float: left;
	}
		header > .nav-menu > input {
			width: 30px;
			height: 30px;
			border: 1px solid #737580;
			border-radius: 50%;
			outline: none;
			background: #5c5e66 url('../../image/icon/menu.png') no-repeat center center;
			margin: 5px 5px 5px 20px;
		}
		header > .nav-menu > ul {
			margin: 0px 0px 0px 20px;
		}
			header > .nav-menu > ul:after {
				content: '';
				display: block;
				line-height: 0px;
				clear: both;
			}
			header > .nav-menu > ul > li {
				display: block;
				float: left;
			}
				header > .nav-menu > ul > li > a {
					display: block;
					padding: 18px 15px 10px 15px;
					color: white;
					font-weight: bold;
					font-size: 12px;
					line-height: 12px;
					text-decoration: none;
					transition: color 0.5s;
				}
				header > .nav-menu > ul > li > a:hover { 
					color: #fc0;
				}
	/*#end nav-menu*/
	/*#start nav-menu-collapse*/
	header > .nav-menu-collapse {
		width: 100%;
		clear: both;
		transition: 0.5s;
	}
		header > .nav-menu-collapse.show {
			display: block;
		}
		header > .nav-menu-collapse > ul {
			border-top: 0px solid #5c5e66;
			margin: 0px;
		}
			header > .nav-menu-collapse.show > ul {
				border-top-width: 1px;
			}
			header > .nav-menu-collapse > ul:after {
				content: '';
				display: block;
				line-height: 0px;
				clear: both;
			}
			header > .nav-menu-collapse > ul > li {
				background-color: #484a50;
				border-bottom: 0px solid #505359;
				display: block;
				height: 0px;
				overflow: hidden;
				transition: height 0.2s;
			}
				header > .nav-menu-collapse.show > ul > li {
					height: 32px;
					border-bottom-width: 1px;
				}
				header > .nav-menu-collapse > ul > li > a {
					display: block;
					padding: 10px;
					color: white;
					font-weight: bold;
					font-size: 12px;
					line-height: 12px;
					text-decoration: none;
					opacity: 0;
					transition: color 0.5s;
				}
					header > .nav-menu-collapse > ul > li > a:hover {
						color: #fc0;
					}					
					header > .nav-menu-collapse.show > ul > li > a {
						transition: opacity 0.3s 0.5s linear;
						opacity: 1;
					}
	/*#end nav-menu-collapse*/	
	/*#start nav-right*/
	header > .nav-right {
		float: right;
	}
		header > .nav-right > ul {	
			margin-bottom: 0px;
		}	
			header > .nav-right > ul:after {
				content: '';
				display: block;
				line-height: 0px;		
				clear: both;				
			}	
			header > .nav-right > ul > li {
				display: block;
				float: left;
				position: relative;
			}	
				header > .nav-right > ul > li > a {
					display: block;
					padding: 10px 10px 10px 30px;
					color: white;
					text-decoration: none;
					font-size: 13px;
					line-height: 20px;
					background: no-repeat 5px center;
					transition: color 0.5s;
				}	
					header > .nav-right > ul > li > a:hover {
						color: #fc0;
					}
					header > .nav-right > ul > li > a.log {
						background-image: url('../../image/icon/log.png');
					}	
					header > .nav-right > ul > li > a.register {
						background-image: url('../../image/icon/register.png');						
					}
				header > .nav-right > ul > li > .log-box {	
					position: absolute;
					padding: 15px;
					background-color: white;
					border-radius: 5px;
					border: 1px solid #ddd;
					right: 10px;
					top: 43px;
					z-index: 5;
					display: none;
				}
					header > .nav-right > ul > li > .log-box:before,
					header > .nav-right > ul > li > .log-box:after {	
						content: '';
						display: block;
						position: absolute;
						border: 7px solid transparent;
						width: 0px;
						height: 0px;
						right: 72px;
					}
					header > .nav-right > ul > li > .log-box:before {
						border-bottom-color: #ddd;
						top: -15px;
					}
					header > .nav-right > ul > li > .log-box:after {
						border-bottom-color: white;
						top: -14px;
					}
					header > .nav-right > ul > li > .log-box > form > ul {
						padding: 0;
						margin: 0;
						width: 200px;
					}
						header > .nav-right > ul > li > .log-box > form > ul > li {
							display: block;
							margin: 5px 0px;
						}
							header > .nav-right > ul > li > .log-box > form > ul > li.title > h3 {
								font-size: 13px;
								margin: 0px 0px 10px 0px;
								color: #aaa;
							}
							header > .nav-right > ul > li > .log-box > form > ul > li.input > input {
								width: 100%;
								border: 1px solid #aaa;
								padding: 5px;
								outline: none;
								font-size: 13px;
							}
							header > .nav-right > ul > li > .log-box > form > ul > li.submit > button {
								width: 100%;
								border: 1px solid #aaa;
								padding: 5px;
								background-color: #1c77e0;
								color: white;
								font-size: 13px;
							}
							header > .nav-right > ul > li > .log-box > form > ul > li.feature:after {
								content: '';
								clear: both;
								display: block;
							}
								header > .nav-right > ul > li > .log-box > form > ul > li.feature > section {
									display: inline-block;
								}
									header > .nav-right > ul > li > .log-box > form > ul > li.feature > section:nth-child(1) {
										float: left;
									}
										header > .nav-right > ul > li > .log-box > form > ul > li.feature > section:nth-child(1) > input {
											vertical-align: -2px;
										}
										header > .nav-right > ul > li > .log-box > form > ul > li.feature > section:nth-child(1) > label {
											font-size: 12px;
											line-height: 12px;
										}
									header > .nav-right > ul > li > .log-box > form > ul > li.feature > section:nth-child(2) {
										float: right;	
									}
										header > .nav-right > ul > li > .log-box > form > ul > li.feature > section:nth-child(2) > a {
											font-size: 12px;
										}
							header > .nav-right > ul > li > .log-box > form > ul > li.line > hr {
								margin: 0;
								padding: 0;
							}
							header > .nav-right > ul > li > .log-box > form > ul > li.link-log {
								display: flex;
								margin-top: 15px;
								height: 30px;
							}
								header > .nav-right > ul > li > .log-box > form > ul > li.link-log > section:nth-child(1) {
									line-height: 30px;
									text-align: center;
									width: 100%;
									font-size: 12px;
								}
								header > .nav-right > ul > li > .log-box > form > ul > li.link-log > section:nth-child(2) {
									min-width: 90px;
								}
									header > .nav-right > ul > li > .log-box > form > ul > li.link-log > section:nth-child(2) > a {
										width:35px;
										height:35px;		
										display: inline-block;
										margin-right: 5px;
									}
										header > .nav-right > ul > li > .log-box > form > ul > li.link-log > section:nth-child(2) > a > img {
											width: 35px;
											height: 35px;
										}
				header > .nav-right > ul > li > .register-box {	
					position: absolute;
					padding: 15px;
					background-color: white;
					border-radius: 5px;
					border: 1px solid #ddd;
					right: 10px;
					top: 43px;
					z-index: 5;
					display: none;
				}
					header > .nav-right > ul > li > .register-box:before,
					header > .nav-right > ul > li > .register-box:after {	
						content: '';
						display: block;
						position: absolute;
						border: 7px solid transparent;
						width: 0px;
						height: 0px;
						right: 58px;
					}
					header > .nav-right > ul > li > .register-box:before {
						border-bottom-color: #ddd;
						top: -15px;
					}
					header > .nav-right > ul > li > .register-box:after {
						border-bottom-color: white;
						top: -14px;
					}
					header > .nav-right > ul > li > .register-box > form > ul {
						padding: 0;
						margin: 0;
						width: 200px;
					}
						header > .nav-right > ul > li > .register-box > form > ul > li {
							display: block;
							margin: 5px 0px;
						}
							header > .nav-right > ul > li > .register-box > form > ul > li.title > h3 {
								font-size: 12px;
								margin: 0px 0px 10px 0px;
								color: #aaa;
							}
							header > .nav-right > ul > li > .register-box > form > ul > li.input > input {
								width: 100%;
								border: 1px solid #aaa;
								padding: 5px;
								outline: none;
								font-size: 12px;
							}
							header > .nav-right > ul > li > .register-box > form > ul > li.confirm > article {
								text-align: center;
							}
								header > .nav-right > ul > li > .register-box > form > ul > li.confirm > article > input {
									vertical-align: -2px;
								}
								header > .nav-right > ul > li > .register-box > form > ul > li.confirm > article > label {
									font-size: 11px;
								}
							header > .nav-right > ul > li > .register-box > form > ul > li.submit > button {
								width: 100%;
								border: 1px solid #aaa;
								padding: 5px;
								background-color: #1c77e0;
								color: white;
								font-size: 13px;
							}

	/*#end nav-right*/
	/*#start nav-link */
	header > .nav-link {
		float: right;
	}
		header > .nav-link > ul {
			margin: 0px 50px 0px 0px;
		}
			header > .nav-link > ul:after {
				content: '';
				display: block;
				clear: both;
			}
			header > .nav-link > ul > li {
				display: block;
				float: left;
				padding: 15px 0px;
				margin: 0px 3px;
			}
				header > .nav-link > ul > li > a {
					display: block;
					width: 10px;
					height: 10px;
					border-radius: 50%;
					transform: scale(0.8, 0.8);
					transition: transform 0.2s;
				}
					header > .nav-link > ul > li > a:hover {
						transform: none;
					}					
					header > .nav-link > ul > li > a.nha-dat-ban {
						background-color: #f00;
					}				
					header > .nav-link > ul > li > a.nha-dat-thue {
						background-color: #e69422;
					}				
					header > .nav-link > ul > li > a.dinh-gia {
						background-color: #2dff0d;
					}				
	/*#end nav-link*/
/*#end header*/
/*#start main*/
main {

}
	/*#start banner*/
	main > .banner {
		height: 550px;
		background: white url('../../image/background/background-1.jpg') no-repeat center center;
	}
		main > .banner > .box {
			background-color: rgba(0, 0, 0, 0.7);
			position: relative;
			top: 25%;
			border-radius: 5px;
			width: 500px;
			margin: 0px auto;
			padding: 30px;
		}
			main > .banner > .box > h2 {
				color: white;
				font-size: 24px;
				text-align: center;
				margin: 0px 0px 20px 0px;
			}
			main > .banner > .box > .tab-container {
				text-align: center;
				margin: 10px 0px;
			}
				main > .banner > .box > .tab-container > a {
					display: inline-block;
					background: no-repeat left center;
					height: 26px;
					line-height: 30px;
					font-size: 15px;
					color: white;
					padding-left: 30px;
					margin: 0px 10px;
					text-decoration: none;
					transition: color 0.5s;
				}
					main > .banner > .box > .tab-container > a:hover {
						color: #fc0;
					}
			main > .banner > .box > .input-box {
				height: 35px;
				display: block;
				background-color: white;
				position: relative;
			}
				main > .banner > .box > .input-box > input[type='text'] {
					padding: 8px 10px;
					height: 35px;
					border: none;
					width: 100%;
					outline: none;
				}
				main > .banner > .box > .input-box > input[type='submit'] {
					border: none;
					outline: none;
					width: 45px;
					height: 35px;
					background: #1c77e0 url('../../image/icon/search.png') no-repeat center center;
					position: absolute;
					top: 0px;
					right: 0px;
				}
	/*#end banner*/
	/*#start search*/
	main > .search-container {
		position: relative;
		padding: 60px 0px;
		background: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 1)), url('../../image/background/background-2.png') no-repeat center top;
	}	
		main > .search-container:before {
			content: '';
			display: block;
			height: 60px;
			width: 60px;
			position: absolute;
			top: -30px;
			left: calc(50% - 30px);
			background: #1c77e0 url('../../image/icon/search-plus.png') no-repeat center center;
			border-radius: 50%;
		}
		main > .search-container > .title-box {
			text-align: center;
			cursor: pointer;
		}
			main > .search-container > .title-box > h2 {
				font-size: 30px;
				font-family: Davida;
				text-align: center;	
				color: #1c77e0;				
			}			
		main > .search-container > .search-box {
			padding: 20px;
			opacity: 0;
			display: none;
		}
			main > .search-container > .search-box > .map {
				width: 100%;
				padding: 20px;
			}
				main > .search-container > .search-box > .map > .map-temp {
					background: url('../../image/background/map.jpg') no-repeat center center;
					height: 400px;
					width: 100%;
					border: 1px solid #ddd;
					border-radius: 5px;
					box-shadow: 0px 0px 10px #ddd;
				}
			main > .search-container > .search-box > .search {
				padding: 20px;
				min-width: 300px;
				max-width: 300px;
				margin: auto;	
			}
				main > .search-container > .search-box > .search > form {
					width: 90%;
					margin: auto;
				}
					main > .search-container > .search-box > .search > form > ul > li {
						margin: 5px 0px;
						display: flex;
						width: 100%;
					}
						main > .search-container > .search-box > .search > form > ul > li > section {
							min-width: 50%;
						}
							main > .search-container > .search-box > .search > form > ul > li > section.full {
								min-width: 100%;
							}
							main > .search-container > .search-box > .search > form > ul > li > section > label {
								display: block;
								font-size: 13px;
								color: #666;
							}
							main > .search-container > .search-box > .search > form > ul > li > section > input,
							main > .search-container > .search-box > .search > form > ul > li > section > select {
								width: calc(100% - 10px);
								height: 25px;
								font-size: 12px;
								outline: none;
								border: 1px solid #ccc;
								padding: 3px;
							}
								main > .search-container > .search-box > .search > form > ul > li > section > input:focus,
								main > .search-container > .search-box > .search > form > ul > li > section > select:focus {
									border-color: #1c77e0;
								}
							main > .search-container > .search-box > .search > form > ul > li > section > button {
								width: calc(100% - 10px);
								border: none;
								outline: none;
								background-color: #1c77e0;								
								color: white;
								font-size: 14px;
								padding: 5px 0px;
								margin-top: 10px;
							}
	/*#end search*/
	/*#start function*/
	.function-container {
		
	}
	/*#end function*/
	/*#start product*/
	main > .product-container {
		position: relative;
		z-index: 1;
		background: url('../../image/background/background-3.png') no-repeat center top;
	}
		main > .product-container > .container {

		}
			main > .product-container > .container > .row > .column {
				padding: 30px;
				max-width: 300px;
				margin: 0 auto;
			}
				main > .product-container > .container > .row > .column > .info {

				}
					main > .product-container > .container > .row > .column > .info > h2 {
						color: #1c77e0;
						font-weight: bold;
						font-size: 17px;
						margin-bottom: 10px;
					}
					main > .product-container > .container > .row > .column > .info > p {
						text-align: justify;
						font-size: 13px;
					}
				main > .product-container > .container > .row > .column > .product-panel {
					overflow: hidden;
					margin-top: 20px;
					border: 1px solid #dcdcde;
					padding: 5px 0px;
					border-radius: 5px;
					background-color: rgba(255, 255, 255, 0.5);
					height: 472px;
				}
					main > .product-container > .container > .row > .column > .product-panel > .product {
						top: 0px;
						position: relative;
					}
						main > .product-container > .container > .row > .column > .product-panel > .product > .item {
							display: flex;
							margin: 10px 0px;
						}
							main > .product-container > .container > .row > .column > .product-panel > .product > .item > .image {
								min-width: 105px;
								min-height: 80px;
								max-width: 230px;
								padding: 0px 15px;
							}
								main > .product-container > .container > .row > .column > .product-panel > .product > .item > .image > img {
										width: 100%;
								}
							main > .product-container > .container > .row > .column > .product-panel > .product > .item > .info {
								width: 100%;
							}
								main > .product-container > .container > .row > .column > .product-panel > .product > .item > .info > h3 {
									margin: 5px 0px;
									font-size: 15px;
									font-weight: bold;
								}
								main > .product-container > .container > .row > .column > .product-panel > .product > .item > .info > p {
									font-size: 12px;
									margin: 0px;
								}
									main > .product-container > .container > .row > .column > .product-panel > .product > .item > .info > p.gia:before {
										content: 'Giá: ';
									}
									main > .product-container > .container > .row > .column > .product-panel > .product > .item > .info > p.vi-tri:before {
										content: 'Vị trí: ';
									}
	/*#end product*/
/*#end main*/
/*#start footer*/
footer {
	background-color: #2e4659;
	padding: 30px 0px 5px 0px;
	margin-top: 30px;
	position: relative;
}
	footer:before {
		content: '';
		display: block;
		height: 60px;
		width: 60px;
		position: absolute;
		top: -30px;
		left: calc(50% - 30px);
		background: #1c77e0 url('../../image/icon/about.png') no-repeat 20px center;
		border-radius: 50%;
	}
	/*#start top-footer*/
	footer > .top-footer {
		display: flex;
	}
		/*#start about*/
		footer > .top-footer > .about-container {
			display: flex;
			flex-direction: column;
		}
			/*#start row*/
			footer > .top-footer > .about-container > .about-row {

			}
				/*#start column*/
				footer > .top-footer > .about-container > .about-row > .col {
					padding: 0px 20px;
				}					
					footer > .top-footer > .about-container > .about-row > .col > h3 {
						color: #82b4ed;
						font-size: 18px;
					}
					footer > .top-footer > .about-container > .about-row > .col > p {
						color: white;
						font-size: 12px;
					}
					footer > .top-footer > .about-container > .about-row > .col > a {
						color: #82b4ed;
						font-size: 12px;						
					}
				/*#end column*/
			/*#end row*/
		/*#end about*/
		/*#start link*/
		footer > .top-footer > .link-container {

		}
			footer > .top-footer > .link-container > ul {
				margin: 30px 0px;
			}			
				footer > .top-footer > .link-container > ul:after {
					content: '';
					display: block;
					clear: both;
				}			
				footer > .top-footer > .link-container > ul > li {
					display: block;
					float: left;
					width: calc(50% - 30px);
					margin: 15px;
				}
					footer > .top-footer > .link-container > ul > li > a {
						display: block;
						height: 65px;
						text-decoration: none;
					}
						footer > .top-footer > .link-container > ul > li:nth-child(even) > a {
							background: no-repeat left center;
							padding-left: 65px;
						}
						footer > .top-footer > .link-container > ul > li:nth-child(odd) > a {
							background: no-repeat right center;
							padding-right: 65px;
						}
						footer > .top-footer > .link-container > ul > li > a > i {
							font-size:; 12px;
							font-style: normal;
							line-height: 65px;
							color: white;
							display: block;
						}
							footer > .top-footer > .link-container > ul > li:nth-child(even) > a > i {
								text-align: left;
								padding-left: 5px;
							}
							footer > .top-footer > .link-container > ul > li:nth-child(odd) > a > i {
								text-align: right;
								padding-right: 5px;
							}

		/*#end link*/
	/*#end top-footer*/
	/*#start bottom-footer*/
	footer > .bottom-footer {
		border-top: 1px solid #aaa;
		margin-top: 10px;
		padding-top: 20px;
	}
		footer > .bottom-footer > p {
			text-align: center;
			color: white;
			font-size: 12px;
			margin: 0;
		}
		footer > .bottom-footer > p.email {
			padding-left: 20px;
		}
			footer > .bottom-footer > p.email > a {
				color: white;
			}
			footer > .bottom-footer > p.email:before {
				content: '';
				display: inline-block;
				vertical-align: bottom;
				width: 26px;
				height: 20px;
				background: url('../../image/icon/mail.png') no-repeat left center;
			}
	/*#end bottom-footer*/
/*#end footer*/

/* @media */
.text-xs-left { text-align: left !important; }
.text-xs-right { text-align: right !important; }
.text-xs-center { text-align: center !important; }
.text-xs-justify { text-align: justify !important; }
 
.margin-xs-auto { margin-left: auto !important; margin-right: auto !important; }
.margin-xs-left-right-0 { margin-left: 0px; margin-left: 0px }

.float-xs-left { float: left !important; }
.float-xs-right { float: right !important; }
.float-xs-none { float: none !important; }

.flex-xs-row { flex-direction: row !important; }
.flex-xs-column { flex-direction: column !important; }

.max-width-xs-none { max-width: none !important; }

.custom-visible-0 { display: block !important; }
.custom-hidden-0 { display: none !important; }
.custom-width-250-0 { width: 250px !important; }
.custom-min-width-0-0 { min-width: 0px !important; }

@media (min-width: 400px) {
    .custom-visible-400 { display: block !important; }
    .custom-hidden-400 { display: none !important; }
	.custom-min-width-300-400 { min-width: 300px !important; }
}

@media (min-width: 590px) {
    .custom-visible-590 { display: block !important; }
    .custom-hidden-590 { display: none !important; }
    .custom-width-500-590 { width: 500px  !important; }
}

@media (min-width: 768px) {
    .text-sm-left { text-align: left !important; }
    .text-sm-right { text-align: right !important; }
    .text-sm-center { text-align: center !important; }
    .text-sm-justify { text-align: justify !important; }

    .margin-sm-auto { margin-left: auto !important; margin-right: auto !important; }
    .margin-sm-default { margin: 0 }

    .float-sm-left { float: left !important; }
    .float-sm-right { float: right !important; }
    .float-sm-none { float: none !important; }

    .flex-sm-row { flex-direction: row !important; }
    .flex-sm-column { flex-direction: column !important; }

    .max-width-sm-none { max-width: none !important; }
}
 
@media (min-width: 992px) {
    .text-md-left { text-align: left !important; }
    .text-md-right { text-align: right !important; }
    .text-md-center { text-align: center !important; }
    .text-md-justify { text-align: justify !important; }

    .margin-md-auto { margin-left: auto !important; margin-right: auto !important; }
    .margin-md-default { margin: 0 }

    .float-md-left { float: left !important; }
    .float-md-right { float: right !important; }
    .float-md-none { float: none !important; }

    .flex-md-row { flex-direction: row !important; }
    .flex-md-column { flex-direction: column !important; }

    .max-width-md-none { max-width: none !important; }
}
 
@media (min-width: 1200px) {
    .text-lg-left { text-align: left !important; }
    .text-lg-right { text-align: right !important; }
    .text-lg-center { text-align: center !important; }
    .text-lg-justify { text-align: justify !important; }

    .margin-lg-auto { margin-left: auto !important; margin-right: auto !important; }
    .margin-lg-default { margin: 0 }

    .float-lg-left { float: left !important; }
    .float-lg-right { float: right !important; }
    .float-lg-none { float: none !important; }

    .flex-lg-row { flex-direction: row !important; }
    .flex-lg-column { flex-direction: column !important; }

    .max-width-lg-none { max-width: none !important; }
}